<template>
  <div>
    <!-- Form -->
    <el-button class="relation" type="text" @click="dialogSafeLook = true">关联网关</el-button>

    <el-dialog title="收货地址" :visible.sync="dialogSafeLook">
      <div slot="footer" class="dialog-footer">
        <el-button class="clears" @click="dialogSafeLook = false">取 消</el-button>
        <el-button class="bottonConfirm" type="primary" @click="dialogSafeLook = false">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        dialogFormVisible: false,
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        },
        formLabelWidth: '101px',
        formLabelWidth2: '50px',
        currentPage4: 4
      }
    },
    methods: {
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`)
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`)
      }
    }
  }
</script>
<style scoped="">
  /deep/ .el-input__inner {
    height: 30px;
  }
  /deep/ .clears{
    padding: 6px 16px;
    background-color: #526D89;
    border-color: #526D89 ;
    color: #fff;
    float: right;
    margin-left: 10px;
  }
  /deep/ .indieWidth {
    padding: 6px 16px;
    float: right;
    border:1px solid #0072F3;
    background: #0072F3;
    margin-top: 6px;
  }
  /deep/ .bottonQuery {
    margin-top: 6px;
    padding: 6px 16px;
    float: right;
    border:1px solid #0072F3;
    background: #0072F3;
  }
  /deep/ .bottonConfirm {
    padding: 6px 16px;
    float: right;
    border:1px solid #0072F3;
    background: #0072F3;
  }
  /deep/ .el-dialog {
    border-radius: 5px;
  }
  /deep/ .el-dialog__header {
    background: #E3E6EE;
    font-size: 18px;
    font-weight: bold;
    padding: 12px 20px 9px 20px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  /deep/ .el-dialog__headerbtn {
    top: 15px;
  }
  /deep/ .el-dialog__body {
    padding: 20px;
  }
  /deep/ .el-dialog__footer {
    height: 50px;
    border-top: 1px solid #DCDFE6;
  }
  /deep/ .el-form-item {
    margin-bottom: 10px;
  }
  /deep/ .el-table__header-wrapper {
    height: 40px;
  }
  /deep/ .el-table--border td, .el-table--border th, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
    padding: 0px;
  }
  /deep/ .el-table th {
    padding: 4px 0px;
  }
  /deep/ .el-table td {
    padding: 13px 0px;
    font-weight: normal;
  }
  /deep/ .block {
    margin-top: 5px;
    height:15px;
  }
  /deep/ .el-pagination {
    float: right;
  }
  /deep/ .relation {
    float: right;
    height: 30px;
    font-size: 14px;
    padding: 6px 16px;
    color: #fff;
    background: #0072F3;
    border-color: #0072F3;
  }
</style>
